<template>
    <div style="margin: 20px;">
        <div style="background: #fff; padding: 30px;">
            <a-row>
                <a-col :span="8">
                    <div class="flex-row-center size-14">
                        <div class="color-000-85">分组名称：</div>
                        <div class="color-000-65">{{data.groupName}}</div>
                    </div>
                </a-col>
                  <a-col :span="8">
                    <div class="flex-row-center size-14">
                        <div class="color-000-85">分组类型：</div>
                        <div class="color-000-65">{{data.type == 1 ? '固定商品' : '可选商品'}}</div>
                    </div>
                </a-col>
              
            </a-row>
            
            
            <a-row class="margin-top-30">
                <a-col :span="8">
                    <div class="flex-row-center size-14">
                        <div class="color-000-85">xxx</div>
                        <div class="color-000-65">{{data.xxx}}</div>
                    </div>
                </a-col>
                <a-col :span="8">
                    <div class="flex-row-center size-14">
                        <div class="color-000-85">xxx</div>
                        <div class="color-000-65">{{data.xxx}}</div>
                    </div>
                </a-col>
                <a-col :span="8">
                    <div class="flex-row-center size-14">
                        <div class="color-000-85">xxx</div>
                        <div class="color-000-65">{{data.xxx}}</div>
                    </div>
                </a-col>
            </a-row>
            <div class="flex-row size-14 margin-top-30" style="line-height: 24px;">
                <div class="color-000-85" style="min-width: 70px;">备注：</div>
                <div class="color-000-65">{{data.remark}}</div>
            </div>
        </div>

        <div style="background: #fff; padding: 30px;" class="margin-top-30" v-if="images&&images.length>0">
            <div class="color-000-85 size-14" style="min-width: 70px;">图片：</div>
            <viewer :images="images" style="margin-top: 10px">
                <img v-for="src in images" :key="src" :src="src"
                     style="width: 300px; height: 180px; object-fit: contain; margin: 0 15px 15px 0;"
                     :onerror="errorImg">
            </viewer>
        </div>
       
    </div>
</template>

<script>
  export default {
    name: "contractInfo",
    data() {
      return {
        errorImg: 'this.src="' + require('../../image/icon_default.png') + '"',
        groupId: 0,
        data: {},
        images: [],
        pdfs: []
      }
    },
    mounted() {
      console.log(123, this.$route);
      this.groupId = this.$route.query.groupId;
      this.getInfo();
      this.getImages();
    },
    computed: {
      getSize() {
        return function (bytes) {
          return this.$util.formatSize(bytes)
        }
      }
    },

    methods: {
      getInfo() {
        let p = {
          groupId: this.groupId
        }
        this.$util.showLoading(this);
        //TODO 调用详情接口
        // this.$util.get('xxx', p, true).then((res) => {
        //   this.$util.hideLoading();
        //   console.log(111, res);
        //   this.data = res.content;
        // })
        this.$util.hideLoading();
      },
      getImages() {
        //获取图片
      },
    }
  }
</script>

<style scoped>
    .pdf-bg{
        width: 340px;
        height: 96px;
        border-radius: 2px;
        border: 1px solid #E9E9E9;
    }
</style>
